﻿@import '/VUD/Style Library/Adres/Styles/Less/vars.less';

/*======== Ajustes al core de Sharepoint ========*/
.ms-core-webpartadder{
    z-index: 1;
}
.ms-fcl-b{
    display: none;
}
#sideNavBox{
    display: none;
}
.ms-srch-sb > .ms-srch-sb-navLink{
    height: 0;
}
#DeltaPlaceHolderMain{
    margin: 40px 0;
}
#s4-titlerow{
    display: none !important;  
}

#s4-bodyContainer {
    padding-bottom: 0px; 
    // overflow-x: hidden; 
}

#contentBox { 
    margin: 0px;
    min-width: 100%;
}

#contentRow{
    padding: 0;
}

.ms-siteactions-root > span > a.ms-core-menu-root {
    width: auto;
    height: auto;
}
.nopadding{
	padding: 0 !important;
}
.nopadding-left{
padding-left: 0px !important;
}
.nopadding-right{
padding-right: 0px !important
}
.nomargin{
    margin: 0 !important;
}
#ms-help {
    span { 
        height: 28px !important;
        width: 28px !important;
    }
}

li.dfwp-item {
    list-style-type: none;
}

.visible{
display: block;
}
.noVisible{
display: none;
}

.ms-webpartzone-cell{
    margin: 0px;
}

/* Fixed Display Table Webparts */
.ms-webpart-zone {
    display: block !important;
    .ms-webpart-cell-vertical {
        display: block !important;
        .ms-webpart-chrome-vertical {
            display: block !important;
            .owl-carousel
            {
                padding: 0px !important;
                &.owl-loaded
                {
                padding: 0px !important; 
                }
            }
        }
    }
} 
// /* Fixed Display Table Webparts */
//   #menu-sharepoint
//     {
//         #zz11_RootAspMenu, #zz10_RootAspMenu, #zz9_RootAspMenu, #zz8_RootAspMenu
//         {
//             li.static
//             {
//                 &.ms-listMenu-editLink
//                 {
//                     display: none; 
//                 }

//                 &:nth-child(1)
//                 {
//                     .ms-core-listMenu-item
//                     {
//                         //padding-left: 0px;
//                     }
//                 }
//             } 
//         }
//     }
//     .ms-core-listMenu-horizontalBox .dynamic .dynamic-children.additional-background{
//         background-image: none;
//         span{
//             padding-right: 4px;
//         }
//         &::after{
//             content: '\203A';
//             margin-left: 4px;
//             color: #3c67de;
//         }
//     }
/*======== Ajustes al core de Sharepoint ========*/
// INICIO | Estilos Predeterminados 
/*******************************/
/*********** Textos ************/
/*******************************/

.uppercase {
    text-transform:uppercase;
}

.align-right {
    text-align: right;
}
.align-left {
    text-align: left;
}

.parrafo-05 { font-size: 0.5em }
.parrafo-06 { font-size: 0.6em }
.parrafo-07 { font-size: 0.7em }
.parrafo-08 { font-size: 0.8em }
.parrafo-09 { font-size: 0.9em }
.parrafo-10 { font-size: 1em }
.parrafo-11 { font-size: 1.1em }
.parrafo-12 { font-size: 1.2em }
.parrafo-13 { font-size: 1.3em }
.parrafo-14 { font-size: 1.4em }
.parrafo-15 { font-size: 1.5em }
.parrafo-27 { font-size: 2.7em }
.parrafo-40 { font-size: 4em }

/*******************************/
/********** Alineados **********/
/*******************************/

.center {
    text-align: center;
}
.right {
    float: right;
}
.left {
    float: left;
}
.img-center {
    display:block;
    margin:0 auto 0 auto;
    max-width: 100%;
}
.img-100 {
    height: auto;
    max-width: 100%; 
    width: 100%; 
}
/*******************************/
/********* Posiciones **********/
/*******************************/
.relative {
    position:relative;
}
.absolute {
    position:absolute;
}

.t-10 { top: 10px; }
.t-30 { top: 30px; }
.t-50 { top: 50px; }
.t-70 { top: 70px; }
.t-100 { top: 100px; }
.t--15 { top: -15px; }

.b-0 { bottom: 0px; }
.b-30 { bottom: 30px; }
.b-100 { bottom: 100px; }
.b-150 { bottom: 150px; }



/*******************************/
/********** Paddings ***********/
/*******************************/

.p-0 { padding: 0; }
.p-5 { padding: 5px; }
.p-10 { padding: 10px; }
.p-20 { padding: 20px; }
.p-30 { padding: 30px; }
.p-40 { padding: 40px; }
.p-50 { padding: 50px; }

.pt-5 { padding-top: 5px; }
.pt-10 { padding-top: 10px; }
.pt-15 { padding-top: 15px; }
.pt-20 { padding-top: 20px; }
.pt-30 { padding-top: 30px; }
.pt-40 { padding-top: 40px; }
.pt-50 { padding-top: 50px; }

.pb-5 { padding-bottom: 5px; }
.pb-10 { padding-bottom: 10px; }
.pb-20 { padding-bottom: 20px; }
.pb-30 { padding-bottom: 30px; }
.pb-40 { padding-bottom: 40px; }
.pb-50 { padding-bottom: 50px; }

.pl-5 { padding-left: 5px; }
.pl-10 { padding-left: 10px; }
.pl-20 { padding-left: 20px; }
.pl-30 { padding-left: 30px; }
.pl-40 { padding-left: 40px; }
.pl-50 { padding-left: 50px; }

.pr-5 { padding-right: 5px; }
.pr-10 { padding-right: 10px; }
.pr-20 { padding-right: 20px; }
.pr-30 { padding-right: 30px; }
.pr-40 { padding-right: 40px; }
.pr-50 { padding-right: 50px; }
.padding-30{padding: 30px !important;}

/*******************************/
/********** Margins ************/
/*******************************/

.m-0 { margin: 0; }
.m-5 { margin: 5px; }
.m-10 { margin: 10px; }
.m-20 { margin: 20px; }
.m-30 { margin: 30px; }
.m-40 { margin: 40px; }
.m-50 { margin: 50px; }

.mt-5 { margin-top: 5px; }
.mt-10 { margin-top: 10px; }
.mt-30 { margin-top: 30px; }
.mt-50 { margin-top: 50px; }
.mt-100 { margin-top: 100px; }

.mb-0 { margin-bottom: 0px; }
.mb-5 { margin-bottom: 5px; }
.mb-10 { margin-bottom: 10px; }
.mb-30 { margin-bottom: 30px; } 
.mb-50 { margin-bottom: 50px; }

.ml-5 { margin-left: 5px; }
.ml-10 { margin-left: 10px; }
.ml-20 { margin-left: 20px; }
.ml-30 { margin-left: 30px; }
.ml-40 { margin-left: 40px; }
.ml-50 { margin-left: 50px; }

.mr-5 { margin-right: 5px; }
.mr-10 { margin-right: 10px; }
.mr-20 { margin-right: 20px; }
.mr-30 { margin-right: 30px; }
.mr-40 { margin-right: 40px; }
.mr-50 { margin-right: 50px; }



/*******************************/
/********** Z-index ***********/
/*******************************/
.z-1 { z-index:1; }
.z-10 { z-index:10; }


/*******************************/
/********** Floats ***********/
/*******************************/
.float-left {float: left;}
.float-right {float: right;}
.float-none { float: none;}

/*******************************/
/********** Modals ***********/
/*******************************/

.modal-dialog{
    width: 90%;
}

.modal-footer{
    .btn-secundario, .btn-principal{
        min-width: 10%;
    }
}

.hidden{
    display: none; 
}

.loader{
    z-index: 10000;
}
.custom-file.mb-3{
    height: auto !important;
}
// .ms-rtestate-field{
//     h1{
//         color: @azul-min;
//         font-size: 40px;
//         letter-spacing: 0px;
//         line-height: 1;
//         font-family: @lato-heavy;
// 		letter-spacing: 0px;
		
//     }
// 	h2{
// 		color: @azul-h2;
// 		font-size: 25px; 
// 		letter-spacing: 0;
// 		font-family: @lato-heavy;
// 	}
// 	h3{
// 		color: #767071;
// 		font-size: 20px; 
// 		font-family: @lato-heavy;
// 		letter-spacing: 0;
// 	}
// 	h4{
// 		color: #607d8b;
// 		font-size: 18px; 
// 		font-family: @lato-heavy;
// 		letter-spacing: 0;
// 	}
	
// }
// FIN | Estilos Predeterminados 
body {
    font-family: Verdana, Geneva, sans-serif;
    font-size: 16px;
    // color: @gris-text;
    -webkit-font-smoothing: antialiased;  
    -moz-osx-font-smoothing: grayscale; 
}

// h1{
//     color: @azul-min;
//         font-size: 40px;
//         line-height: 1;
//         font-family: @lato-heavy;
// 		letter-spacing: 0px;
// }

// h2{
//     color: @azul-h2;
//     font-size: 25px; 
//     letter-spacing: 0;
// 	font-family: @lato-heavy;
// }

// h3{
//     color: #767071;
// 	font-size: 20px; 
// 	font-family: @lato-heavy;
// 	letter-spacing: 0;

// }

// h4{
//     color: #607d8b;
// 	font-size: 18px; 
// 	font-family: @lato-heavy;
// 	letter-spacing: 0;

// }

// h5{
//     color: #003685;
//     font-size: 16px; 
//     font-weight: normal;
//     letter-spacing: -1.2px;  
// }
// h6, .ms-rtestate-field h6 {
//     color: #545454;
//     font-size: 16px;
//     font-family: "Source Sans Pro Semibold";
//     letter-spacing: -1.2px;
// }
// p, .ms-rtestate-field p{
//     color: @gris-text;
//     font-size: 16px;
//     font-family: @lato-regular;
//     line-height: 19px;
//     text-align: justify;
//     strong{
//         color: @gris-text;
//         font-family: @lato-bold;
//     }

// }
// a{
//     &:hover{
//         text-decoration: none;
//     }
//     &:focus{
//         outline: none;
//     }
// }
// .ms-rteStyle-Accent1{
//     color: red !important;
//     font-family: @lato-bold;
// }
// .ms-rteStyle-Accent2{
//     color: green !important;
//     font-family: @lato-bold;
// }

// MIGA DE PAN
// .breadcrumb {
//     padding-top: 10px;
//     padding-bottom: 10px;
//     background: 0;  
//     span{
//         text-decoration: none;
//         a{
//             text-decoration: none;
//         }

//         span{
//             color: #686868 ;
//             font-size:  15px;
//             font-family: @lato-regular;
//             a{
//                 color: #686868 ;
//                 &:hover{
//                     color: @azul-min;
//                 }
//             }

//             &:nth-child(even){
//                 padding: 0px 15px;
//                 color: @azul-min ;
//             }

//             &:nth-child(2){
//                 padding-left: 0 ;
//             }

//             &:last-child{
//                 color: #3c67de ;
//             }
//             &:hover{
//                 color: @azul-min;
//             }

//         }
//     }
// }

// .menu-paginas{
//     margin-top: 60px;
//     .ms-rtestate-field{
//         font-size: 25px;
//         margin-bottom: 20px;
//         color: @azul-min;
//         position: relative;
//         font-family: @lato-bold;
//         &::after{
//             content: '';
// 			width: 4%;
// 			height: 3px;
// 			background: @azul-min;
// 			display: block;
//         }
//     }
//     ul.dfwp-list.row{
//         margin-right: -15px !important;
//         margin-left: -15px !important;
//         li{
//             div.item{
//                 height: 150px;
//                 border: 2px solid @amarillo;
//                 border-radius: 5px;
//                 &:hover{
//                     background: @amarillo;
//                     border: none;
//                     .link-item{
//                         a{
//                             color: @blanco;
//                         }
//                     }
//                 }
//                 .link-item{
//                     position: relative;
//                     margin-top: 28px;
//                     justify-content: center;
//                     display: flex;
//                     margin: auto;
//                     a{
//                         color: @azul-min;
//                         position: relative;
//                         font-size: 16px;
//                         text-align: center;
//                         min-width: 156px;
//                         min-height: 63px;
//                         margin-top: 78px;
//                         &::before{
//                             content: ' ';
//                                 position: absolute;
//                                 background: url('/Style Library/MinDefensa/Image/nuestros-servidores (1).svg') center;
//                                 background-repeat: no-repeat !important;
//                                 width: 100%;
//                                 height: 100%;
//                                 color: red;
//                                 top: -74px;
//                                 left: 0;
//                         }
//                     }
//                 }
//             }
//             &:first-child{
//                 div.item{
//                     .link-item{
//                         a::before{
//                             background: url('/Style Library/MinDefensa/Image/nuestra-institucion.svg') center;
//                         }
//                     }
//                 }
//             }
//             &:nth-child(3){
//                 div.item{
//                     .link-item{
//                         a::before{
//                             background: url('/Style Library/MinDefensa/Image/centro-documentos.svg') center;
//                         }
//                     }
//                 }
//             }
//             &:nth-child(4){
//                 div.item{
//                     .link-item{
//                         a::before{
//                             background: url('/Style Library/MinDefensa/Image/organigrama.svg') center;
//                         }
//                     }
//                 }
//             }
//             &:nth-child(5){
//                 div.item{
//                     .link-item{
//                         a::before{
//                             background: url('/Style Library/MinDefensa/Image/justicia-militar.svg') center;
//                         }
//                     }
//                 }
//             }
//             &:last-child{
//                 div.item{
//                     .link-item{
//                         a::before{
//                             background: url('/Style Library/MinDefensa/Image/obispado-castrense.svg') center;
//                         }
//                     }
//                 }
//             }
//         }
//     }
// }




/* Buttons */

// .btn-mindefen{
//     background: @azul-min;
//     color: @blanco !important;
//     font-family: @lato-bold;
//     font-size: 16px;
//     display: inline-block;
//     border:none;
//     cursor: pointer;
//     &:hover{
//         color: #fff;
//         text-decoration: none;
//         background: @amarillo !important;
//     }
//     &:visited{        
//      color: #fff !important;
//      text-decoration: none;
//     }

// }
// .btn-fna-p{
//     padding: 17px 12px 0px 50px;
//     font-size: 16px;
//     width: 150px;
//     min-width: 220px;
//     background: #3c67de;
//     color: #fff !important;
//     height: 55px;
//     padding-right: 8px;
//     display: inline-block;
//     border-radius: 5px;
//     line-height: 1;
//     border: none;
//     -webkit-transition: all ease 0.2s;
//     -moz-transition: all ease 0.2s; 
//     -ms-transition: all ease 0.2s;
//     -o-transition: all ease 0.2s;
//     transition: all ease 0.2s;
//     &:hover{
//         background-color: #5683ff !important;
//         color: #fff;
//         text-decoration: none;
//     }
//     &:visited{        
//      color: #fff !important;
//      text-decoration: none;
//     }
// }
// .panel-title{
//     color: @blanco !important;
// }
/* Buttons */ 

// @media (min-width: 1495px){
//    .container{
//         max-width: 1350px;
//    }
   
// }

// @media (max-width: 768px){
//     .menu-paginas{
//         ul.dfwp-list.row{
//             li{
//                 div.item{
//                     margin-bottom: 15px;
//                     .link-item{
//                         a{
//                             width: 100%;
//                         }
//                     }
//                 }
//             }
//         }
//    } 
// }

h1{
    font-size: 32px;
    font-family: @monserat;
    color: @blue;
    font-weight: 700;
    margin-bottom: 20px;
}
label{
    font-size: 16px;
    font-family: @opens;
    color: #4B4B4B;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height: 33px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 33px;
}
input {
    padding: 2px 5px !important;
    border: 1px solid #BABABA !important;
    height: 35px !important;
    border-radius: 6px !important;
}
#step-5{
    p{
        color: #2B4087;
        font-size: 20px;
        &.excep-p{
            font-family: @monserat;
            font-weight: 700;
            font-size: 32px;
        }
    }
}
.multi-step-form{
    .card{
        background: #F9F9F9;
        padding: 40px 0;
        border: none;
        h2 {
            font-size: 24px;
            color: #4E67B4;
            margin-bottom: 30px;
            font-family: @monserat;
            font-weight: 700;
            i{
                background: #19CC3E;
                color: @ligth;
                display: inline-block;
                height: 55px;
                width: 55px;
                border-radius: 50%;
                font-size: 42px;
                padding: 7px;
                margin-right: 32px;
            }
        }
        h3 {
            font-size: 20px;
            color: #4E67B4;
            margin-top: 30px;
            margin-bottom: 20px;
            font-family: @monserat;
        }
        button.btn.btn-vud{
            margin: 30px 0;
            text-transform: uppercase;
        }
        .excep-form{
            h3{
                display: inline-block;
            }
            p{
                display: inline-block;
                position: absolute;
                right: 78px;
            }
            .form-group{
                display: inline-block;
                position: absolute;
                right: 15px;
                #beneficiario{
                    background: @ligth;
                    padding: 0px 6px;
                    border: 1px solid #BABABA;
                    position: relative;
                    left: 6px;
                }
                #reclamante{
                    background: @ligth;
                    padding: 0px 6px;
                    border: 1px solid #BABABA;
                }
            }
        }
    }
}
span.error-text ~ .select2-container {
    border: 1px solid red;
    border-radius: 5px;
}
input.error-text {
    border: 1px solid red !important;
}
.valid{
    border: 1px solid green !important;
}
input[type="radio"] {
    width: 16px;
    height: 16px;
    position: relative;
    top: -4px;
}
button.btn.btn-vud{
    border: 1px solid @azuldark;
    border-radius: 6px;
    // height: 32px;
    font-size: 14px;
    padding: 5px 25px;
    font-family: @opens;
    color: @azuldark;
    transition: all 1s ease;
    &:hover{
        background: @azuldark;
        color: @ligth;
    }
}
button.btn.btn-next{
    // height: 32px;
    background: @blue;
    color: @ligth;
    padding: 10px 25px;
    transition: all 1s ease;
    border-radius: 6px;
    text-transform: uppercase;
    font-family: @opens;
    font-weight: 600;
    &:hover{
        background: #273656;
    }
    &:focus{
        background: #273656;
    }
}

.was-validated .custom-select:invalid ~ .select2-container .select2-selection--single{
    background-clip: padding-box;
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-size: calc(0.75em + 0.375rem) calc(.75em + 0.375rem);
    background-position: right calc(.375em + 1.1875rem) center;
    background-repeat: no-repeat;
    border: 1px solid #dc3545;
}
.was-validated .form-control:invalid{
    background: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(.375em + .1875rem) center;
    background-size: calc(.75em + .375rem) calc(.75em + .375rem);
    padding-right: calc(1.5em + .75rem) !important;
    border-color: #dc3545 !important;
}
.custom-control-label ~ .invalid-feedback{
    position: absolute;
    width: 500px;
    bottom: -8px;
    left: -59px;
}
.custom-control-inline{
    margin-bottom: 25px;
}
.custom-file  {
    label.custom-file-label{
        position: relative;
        font-size: 14px;
        color: #BABABA;
        width: 100%;
    }
    .custom-file-input{
        display: none;
    }
    .limpiar-file{
        button{
            color: #4E67B4;
            text-decoration: underline;
            font-size: 14px;
            font-family: @opens;
            font-weight: 700;
        }
    }
}
.custom-control.custom-checkbox{
    .invalid-feedback{
        position: relative !important;
        width: 100% !important;
        bottom: 0 !important;
        left: 0 !important;
    }
}
.form-group.datapicker{
    position: relative;
    i{
        position: absolute;
        right: 4%;
        bottom: 8px;
        color: #4B4B4B;
        font-size: 20px;
    }
    
}

.card-resumen{
    background: @ligth;
    padding: 10px 30px;
    box-shadow: 0px 2px 4px #0000001F;
    margin-bottom: 50px;
    p{
        margin-bottom: 0;
    }
    h4{
        font-family: @monserat;
        font-weight: 700;
    }
    h5{
        color: #4E67B4;
        margin: 40px 0px 20px;
        font-size: 18px;
        font-family: @monserat;
        font-weight: 600;
    }
    .pills{
        .nav-link{
            text-align: center;
            color: #4E67B4;
            font-size: 26px;
            cursor: pointer;
        }
    }
    .degrade{
        position: relative;
        background: transparent linear-gradient(180deg, #F9F9F900 0%, #F9F9F9 50%) 0% 0% no-repeat padding-box;
        &.blockeds{
            background: transparent;
            &::after{
                content: none;
            }
        }
        &::after{
            content: "";
            display: block;
            position: absolute;

            width: 100%;
            height: 185%;
            top: -100px;
            left: 0;
            background: transparent linear-gradient(180deg, #F9F9F900 0%, #F9F9F9 87%) 0% 0% no-repeat padding-box;
        }
    }
}

#beneficiarios{
    thead{
        th{
            border: none;
            border-bottom: 2px solid @blue;
            background: #EFF2FF;
            color: @blue;
            font-family: @monserat;
            font-weight: 600;
            font-size: 16px;
        }
    }
    tbody{
        td{
            border: none;
            border-bottom: 1px solid #D5D5D5;
            font-size: 16px;
            font-family: @opens;
            i{
                color: #009C9A;
                font-size: 24px;
                cursor: pointer;
            }
        }
    }
}
.steps {
    list-style: none;
    margin: 30px 0;
    width: 100%;
    height: 65px;
    padding: 0px;
    .step-item {
        -ms-flex: 1;
        flex: 1 1 0;
        margin-top: 0;
        min-height: 1rem;
        position: relative; 
        text-align: center;
        -ms-flex: 1;
        &::before{
            content: "";
            height: 2px;
            left: -50%;
            position: absolute;
            top: 9px;
            width: 100%;
            height: 4px;
            background: #C9CEE0;
            
        }
        &:first-child{
            &::before{
                width: 50%;
                left: 0;
            }
        }
        &:last-child{
            &::after{
                content: "";
                position: absolute;
                top: 9px;
                width: 150%;
                height: 4px;
                background: #C9CEE0;
                width: 50%;
                right: 0;
            }
        }
        button {
            color: #acb3c2;
            display: inline-block;
            text-decoration: none;
            border-radius: 50%;
            height: 32px;
            left: 50%;
            top: -3px;
            transform: translateX(-50%);
            width: 32px;
            z-index: 1;
            position: absolute;
            border: 2px solid #C9CEE0;
            font-family: 'Montserrat';
            font-weight: 600;
            font-size: 18px;
            padding: 0;
            padding-top: 1px;
            min-width: 32px;
            background: @ligth !important;
          }
          &.active{
            &::before{
                //background: #F42F63;
                background: @green;
            }
            button{
                border-color: #2B4087;
                background: #fff;
                color: #2B4087;
            }
          }
      }
  }

//   .step .step-item:not(:first-child)::before {

  
  
//   .step .step-item.active a {
    
//   }
  
//   .step .step-item.active ~ .step-item::before {
//     background: #e7e9ed;
//   }
  
//   .step .step-item.active ~ .step-item a::before {
//     background: #e7e9ed;
//   }


//Cristian Maldonado

.select2-container--default .select2-selection--single .select2-selection__rendered.contrast-active{
    color: #fff!important;
}

.select2-selection__placeholder.contrast-active{
    color: #fff!important;
} 

.o365cs-base.o365cs-topnavBGColor-2{
    background: #3366CC !important;
}
.o365cs-nav-header16 .o365cs-nav-rightAlign .o365cs-nav-button, .o365cs-me-tile-nophoto{
    background: #3366CC !important;
}
.o365cs-nav-leftAlign, .o365cs-nav-centerAlign{
    visibility: hidden;
}

#s4-ribbonrow{
    display: none;
}
.table-bordered{
    border: none;
}
.icon.enty-help[data-toggle="tooltip"]{
    display: inline-block;
}